<template>
  <div class="login">
    <navstxt msg="This is an login page" />
    <div class="box-item">
      <div class="box-list">
        <input type="text" placeholder="用户名" v-model="todos[0].user">
      </div>
      <div class="box-list">
        <input type="password" placeholder="密码" v-model="todos[0].password">
      </div>
      <div class="box-list">
        <input type="button" value="登录" @click="logposts()">
      </div>
    </div>

    <div class="userList">
      <div>用户列表</div>
      <ul>
        <li v-for="items in content">{{ items.user }} <span @click="remove_click()">删除</span></li>
      </ul>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import navstxt from "@/components/nav.vue";
import qs from 'qs'
export default {
  name: "log",
  components: {
    navstxt
  },
  data () {
    return {
      content : '',
      todos: [
        {
          user : '',
          password: ''
        }
      ]
    }
  },
  mounted () {
    this.$axios.get('/api/')
            .then((res)=>{
              this.content = res.data;
            })
            .catch((err)=>{
              console.log(err);
            })
  },
  methods: {
    logposts () {
      this.$axios.post('/api/log',qs.stringify({log:this.todos}, { indices: false }))
              .then(res=>{
                if(res.data.code==1){
                  alert(res.data.message);
                  window.location.reload();
                }
                if(!res.data.code){
                  alert(res.data.message);
                  window.location.reload();
                }
              })
              .catch(err=>{
                console.log(err);
              })
    },
    remove_click() {
      alert("a")
    }
  }
};
</script>
